    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>使用 XMLHttpRequest 对象发送 POST 请求</title>
        <script>
            function checkUsername() {
                
                var xhr = new XMLHttpRequest();
                
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                        
                        document.getElementById('result').innerHTML = xhr.responseText;
                        
                        
                        if (xhr.responseText == '用户名可用') {
                            document.getElementById('regisBtn').disabled = false;       
                            document.getElementById('result').style.color = 'green';    
                        } else {
                            document.getElementById('regisBtn').disabled = true;        
                            document.getElementById('result').style.color = 'red';      
                        }
                    } else {
                        
                        document.getElementById('result').innerHTML = '请求失败';
                    }
                }
                
                xhr.open('POST', 'XHRServlet', true);
                xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                var username = document.getElementById('username').value;
                xhr.send('todo=check&username=' + username);
            }

            function register() {
                
                var xhr = new XMLHttpRequest();
               
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                       
                        document.getElementById('result').innerHTML = xhr.responseText;
                    } else {
                      
                        document.getElementById('result').innerHTML = '请求失败';
                    }
                }
            
                xhr.open('POST', 'XHRServlet', true);
                xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                xhr.send('todo=register');
            }
        </script>
    </head>
    <body>
        <h1>使用 XMLHttpRequest 对象发送 POST 请求</h1>
        <input type="text" id="username" onblur="checkUsername()" placeholder="请输入用户名">
        <button id="regisBtn" type="button" onclick="register()">注册</button>
        <div id="result"></div>
    </body>
    </html>